/*******************************
	css reset
*******************************/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin:0;padding:0;font-size:100%;font-family:inherit;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block;}
body {line-height:1;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after, q:before, q:after {content:'';content:none;}
table {border-collapse:collapse;border-spacing:0;}
iframe, form, fieldset, legend, label, input, button, select, option, textarea {border:0;line-height:normal;}
input[type=checkbox], input[type=radio] {box-sizing:border-box;cursor:pointer;width:16px;height:16px;}
button, input[type=button], input[type=image], input[type=reset], input[type=submit] {-webkit-appearance:button;cursor:pointer;overflow:visible;width:auto;}
button::-moz-focus-inner, input::-moz-focus-inner {border:0;padding:0;}
a[href], label[for], select {cursor:pointer;}
html {-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);}
/*******************************
	clearfix
*******************************/
.clearfix:after {content:'';display:block;width:0;height:0;font-size:0;line-height:0;visibility:hidden;clear:both;}
.clearfix {zoom:1;}



/*******************************
	@font-face
*******************************/
@font-face {
    font-family: 'HeroRegular';
    src: url('fonts/hero-webfont.eot');
    src: url('fonts/hero-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/hero-webfont.woff') format('woff'),
         url('fonts/hero-webfont.ttf') format('truetype'),
         url('fonts/hero-webfont.svg#HeroRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'HoneyScriptLight';
    src: url('fonts/honeyscript-light-webfont.eot');
    src: url('fonts/honeyscript-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/honeyscript-light-webfont.woff') format('woff'),
         url('fonts/honeyscript-light-webfont.ttf') format('truetype'),
         url('fonts/honeyscript-light-webfont.svg#HoneyScriptLight') format('svg');
    font-weight: normal;
    font-style: normal;

}



/*******************************
	type
*******************************/
a {color:#000;text-decoration:none;}
	a:hover {color:#c10831}
	a:active {}
	a:visited {}

h1, h2, h3, h4, h5, h6 {line-height:normal;margin-bottom:.5em;font-weight:600;color:#000;}
	h1 {font-size:34px;}
	h2 {font-size:26px;}
	h3 {font-size:22px;margin-bottom:.1em;}
	h4 {font-size:18px;margin-bottom:.1em;}
	h5 {font-size:14px;margin-bottom:.1em;}
	h6 {font-size:12px;margin-bottom:.1em;}

blockquote, p {margin-bottom:1em;}

sup, sub {font-size:60%;line-height:0;vertical-align:baseline;position:relative;}
	sup {top:-.5em;}
	sub {bottom:-.25em;}

h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child, blockquote:last-child, p:last-child {margin-bottom:0;}



/*******************************
	lists
*******************************/
ul, ol, dl {list-style:none outside;font-size:14px;}
ul ul, ul ol, ul dl, ol ul, ol ol, ol dl, dl ul, dl ol, dl dl {}
li {background:url(img/bullet.gif) 0 7px no-repeat;padding-left:11px;}



/*******************************
	images
*******************************/
img {border:0;-ms-interpolation-mode:bicubic;}



/*******************************
	tables
*******************************/
table {}
	th {}
	td {}



/*******************************
	form controls
*******************************/
legend {display:none;}
label{font-size:14px;}
input[type=password], input[type=text] {border:2px solid #000;width:209px;height:22px;color:#717171;padding:2px 5px; }
button[type=button], button[type=reset], button[type=submit], input[type=button], input[type=image], input[type=reset], input[type=submit],A.submit {height:24px;background-color: #717171;font-family:'DIN1451StdEngschrift';color:white;text-transform:uppercase;padding:0px 10px;}
A.submit{display:inline-block;padding:4px 14px 2px 14px;margin-left:12px;vertical-align: top;}


/*******************************
	pseudo-class transitions
*******************************/
a, a:active, a:focus, a:hover, a:visited, button, button:active, button:focus, button:hover, input, input:active, input:focus, input:hover, textarea, textarea:active, textarea:focus, textarea:hover {-moz-transition:all .25s ease-out;-ms-transition:all .25s ease-out;-o-transition:all .25s ease-out;-webkit-transition:all .25s ease-out;transition:all .25s ease-out;}
.addthis_button_compact{-webkit-transition: none !important;
-moz-transition: none !important;
-o-transition: none !important;
transition: none !important;}


/*******************************
	pseudo selection elements
*******************************/
::-moz-selection {color:#fff;background:#2c2c2c;}
::selection {color:#fff;background:#2c2c2c;}



/*******************************
	$MAIN
*******************************/

html,body{height:100%;overflow-y:hidden;}
body {background: url('img/bg.jpg') repeat left top;}

.body,.content{clear:both; margin:0 auto; width:100%;position:relative;
}
.content{width:910px;}
#container{min-width:910px;min-height:100%;overflow-x:hidden;}

#logo,#pens,#caffe,#mp3,#pen{position:absolute;}
#logo{top:0px;left:0px;}
#pens,#caffe{left:-240px;}
#caffe{top:560px;}
#mp3{right:0px;top:560px;}
#pen{right:-80px;top:200px;}



#book{width:889px;height:531px;background: url('img/content.png') no-repeat top left;position:relative;top:170px;}

#bnr1{width:263px;height:98px;position:absolute;top:-98px;right:40px;background:url('img/paper.png')}
#bnr1 IMG{margin-top:60px;margin-left:48px;}
#menu{width:170px;height:176px;background:url('img/menu_bg.png');position:absolute;left:35px;top:-20px;padding:5px 0 0 20px;

-webkit-transform: rotate(-3deg);  
-moz-transform: rotate(-3deg);  
-ms-transform: rotate(-3deg);  
-o-transform: rotate(-3deg);  
transform: rotate(-3deg);



}

#menu LI{padding:2px 0 7px 20px;}
#menu LI.active{background:url('img/menu_active.png') no-repeat left top;}
#menu LI A{font-family:'HoneyScriptLight';font-size:35px;}

#content{position:absolute;right:44px; top:51px; width:375px;height:415px;}
/* Tiny Scrollbar */
#content .viewport { width: 355px; height: 415px; overflow: hidden; position: relative; }
#content .overview { list-style: none; position: absolute; left: 0; top: 0; padding: 0; margin: 0; }
#content .scrollbar{ background: transparent url(img/scroll_track.png) no-repeat 0 0; position: relative; background-position: 0 0; float: right; width: 19px;height:400px;padding:25px 0; }
#content .thumb { background: transparent url(img/scroll_thumb.png) no-repeat 50% 100%; height: 18px; width: 21px; cursor: pointer; overflow: hidden; position: absolute; top: 0; left: 1px;margin-top:25px; }
#content .disable { display: none; }



#content h1{font-family:'HoneyScriptLight';color:#c10831;font-size:35px;font-weight:normal;line-height:25px;margin-left:5px;margin-top:5px;margin-bottom:19px;}
#content p, #content LI{font-family:'HeroRegular';color:#000;font-size:15px;font-weight:normal;line-height:24px;margin-left:5px;margin-top:5px;margin-bottom:19px;}
#content p a{color:#008bcb;}
#content p a:hover{color:#015b84;}
#content li{margin:3px 0px;background: transparent url(img/scroll_thumb.png) no-repeat 0 3px;padding-left:25px;font-weight:bold;}
#content ul{margin-bottom:19px;}

.picture-frame{background:url('img/pic_frame_1.png') no-repeat left top;width:177px;height:247px;position:absolute;}
.picture-frame.big{background:url('img/pic_frame_2.png') no-repeat left top;width:414px;height:295px;position:absolute;}
.picture-frame.p1{top:170px;left:-20px;z-index:3;}
.picture-frame.p2{top:150px;left:150px;z-index:2;}
.picture-frame.p3{top:260px;left:270px;z-index:1}
.picture-frame.big.p3{top:180px;left:10px;z-index:1}
.picture-frame.p4{top:100px;left:-230px;z-index:1}
.picture-frame.p5{top:50px;left:-160px;z-index:2}

.picture-frame img{margin:12px 0 0 15px;}
.picture-frame p{font-family:'HoneyScriptLight';font-size:35px;text-align:center;}






@media screen and (max-width:1300px) {
    #mp3{ display:none;}
}


/*CONTCTSZZORS*/

.contact_form{
    
}

#contact_form input,#contact_form textarea {margin-bottom:10px !important;border:2px solid #d7d4cb;color:#717171;width:360px; }
#contact_form textarea{width:370px;}
#contact_captcha{width:260px !important;}
#contact_captcha_img{position:relative;top:7px;}
#contactSubmit{border:2px solid #f9f7f4;background-color:#d7d4cb;padding:2px 6px;}